// 横向靠左，竖向:靠上、居中、靠下、stretch、baseline
.flx     { display: flex; }
.flxi     { display: inline-flex; }
.flx-lm  { display: flex; align-items: center }
.flx-lb  { display: flex; align-items: flex-end }
.flx-ls  { display: flex; align-items: stretch }
.flx-ll  { display: flex; align-items: baseline }
// 横向居中，竖向:靠上、居中、靠下
.flx-mt  { display: flex; justify-content: center; }
.flx-mm  { display: flex; justify-content: center; align-items: center; }
.flx-mb  { display: flex; justify-content: center; align-items: flex-end; }
.flx-ms  { display: flex; justify-content: center; align-items: stretch; }
.flx-ml  { display: flex; justify-content: center; align-items: baseline; }
// 横向靠右，竖向:靠上、居中、靠下
.flx-rt  { display: flex; justify-content: flex-end; }
.flx-rm  { display: flex; justify-content: flex-end; align-items: center; }
.flx-rb  { display: flex; justify-content: flex-end; align-items: flex-end; }
.flx-rs  { display: flex; justify-content: flex-end; align-items: stretch; }
.flx-rl  { display: flex; justify-content: flex-end; align-items: baseline; }
// 横向两边，竖向:靠上、居中、靠下
.flx-bt  { display: flex; justify-content: space-between; }
.flx-bm  { display: flex; justify-content: space-between; align-items: center;}
.flx-bb  { display: flex; justify-content: space-between; align-items: flex-end;}
.flx-bs  { display: flex; justify-content: space-between; align-items: stretch;}
.flx-bl  { display: flex; justify-content: space-between; align-items: baseline;}
// 横向等分，竖向:靠上、居中、靠下
.flx-at  { display: flex; justify-content: space-around; }
.flx-am  { display: flex; justify-content: space-around; align-items: center;}
.flx-ab  { display: flex; justify-content: space-around; align-items: flex-end;}
.flx-as  { display: flex; justify-content: space-around; align-items: stretch;}
.flx-al  { display: flex; justify-content: space-around; align-items: baseline;}
// 横向等分，竖向:靠上、居中、靠下
.flx-et  { display: flex; justify-content: space-evenly; }
.flx-em  { display: flex; justify-content: space-evenly; align-items: center;}
.flx-eb  { display: flex; justify-content: space-evenly; align-items: flex-end;}
.flx-es  { display: flex; justify-content: space-evenly; align-items: stretch;}
.flx-el  { display: flex; justify-content: space-evenly; align-items: baseline;}

.flxd-c   { flex-direction: column; }
.flxd-rw  { flex-direction: row-reverse; }
.flxd-cw  { flex-direction: column-reverse; }

.flxa-s   { align-content: flex-start; }
.flxa-c   { align-content: flex-center; }
.flxa-e   { align-content: flex-end; }
.flxa-b   { align-content: space-between; }
.flxa-a   { align-content: space-around; }
.flxa-ev  { align-content: space-evenly; }

.alis-s     { align-self: flex-start}
.alis-c     { align-self: center}
.alis-e     { align-self: flex-end}
.alis-b     { align-self: baseline}
.alis-st     { align-self: stretch}